<template>
	<view class="Index">
		<!-- #ifdef MP-WEIXIN -->
		<view class="status_bar" :style="'height:'+tophight.top+'px;'"></view>
		<!-- #endif -->
		<view class="header">
			<!-- #ifdef MP-WEIXIN -->
			<!-- <image src="@/static/home/head-bg.png" class="background-image"></image> -->
			<!-- #endif -->
			<view>
				<u-input class="input" placeholder="搜索诗文丶字词丶人物..." shape="circle" prefixIcon="search"></u-input>
			</view>
			<view class="nav">
				
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				tophight:{}
			}
		},
		created() {
			// #ifdef MP-WEIXIN
			this.tophight = uni.getMenuButtonBoundingClientRect()
			// #endif
		},
		onLoad() {

		},
		methods: {

		}
	}
</script>

<style lang="scss" scoped>
	.Index{
		.status_bar{
			
		}
		.header{
			height: 600rpx;
			background-size: cover;
			background-position: center;
			background-repeat: no-repeat;
			/* #ifdef H5 */
			padding: 40rpx;
			// background-image: url('@/static/home/head-bg.png');
			/* #endif */
			
			/* #ifdef APP-PLUS */
			padding-top: 88rpx;
			// background-image: url('@/static/home/head-bg.png');
			/* #endif */
			
			/* #ifdef MP-WEIXIN */
			position: relative;
			width: 100%;
			height: 600rpx; /* 假设的高度 */
			overflow: hidden;
			/* #endif */
			.background-image{
				width: 100%;
				height: 100%;
				position: absolute;
				top: 0;
				left: 0;
				right: 0;
				z-index: -1;
			}
			.input{
				width: 60%;
				background: #fff;
			}
		}	
		.nav{
			
		}
	}
	/deep/.uicon-search{
		font-size: 40rpx !important;
	}
</style>
